<!DOCTYPE html>
<html>
    <head>

        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">


        <title>H+ 后台主题UI框架 - 基础表格</title>
        <meta name="keywords" content="">
        <meta name="description" content="">

        <link rel="shortcut icon" href="../favicon.ico"> <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
        <link href="../css/font-awesome.css?v=4.4.0" rel="stylesheet">
        <link href="../css/plugins/iCheck/custom.css" rel="stylesheet">
        <link href="../css/animate.css" rel="stylesheet">
        <link href="../css/style.css?v=4.1.0" rel="stylesheet">
        <link href="../css/shop/style.css" rel="stylesheet">
        <link rel="stylesheet" href="../css/global.css">
    </head>

    <body>
        <div class="container box">
            <div class="row">
                <div class="col-sm-12 order-title">订单详情</div>
            </div>
            <div class="row" style="margin-top: 10px">
                <div class="col-sm-3" id="order-num">订单编号：20190305225465</div>
                <div class="col-sm-3" id="order-time">下单时间：2019-03-05 14：25：10</div>
            </div>
            <div class="row" style="margin-top: 10px">
                <div class="col-sm-3">当前状态：<span class="order-status" id="order-status">等待发货</span></div>
            </div>

            <div class="user-box">
                <div class="col-sm-12 box-title">买家信息</div>
                <ul id="user-info">

                </ul>
            </div>
            <div class="goods-box" style="width: 100%;margin-top: 20px">
                <div class="col-sm-12 box-title">商品详情</div>
                <div class="ibox-content" style="padding:0;">

                    <table class="table table-bordered">
                        <thead>
                            <tr>
                                <th>商品</th>
                                <th>单价</th>
                                <th>数量</th>
                                <th>实付</th>
                                <th>订单状态</th>
                            </tr>
                        </thead>
                        <tbody id="goods-info">
                            <tr>
                                <td class="goods-info">
                                    <div class="goods-img"></div>
                                    <div class="goods-details">
                                        <p class="goods-name">商品名称</p>
                                        <p class="gg">商品规格：</p>
                                    </div>
                                </td>
                                <td>20</td>
                                <td>1</td>
                                <td rowspan="2">20</td>
                                <td rowspan="2">未发货</td>
                            </tr>
                            <tr>
                                <td class="goods-info" style="border:none">
                                    <div class="goods-img"></div>
                                    <div class="goods-details">
                                        <p class="goods-name">商品名称</p>
                                        <p class="gg">商品规格：</p>
                                    </div>
                                </td>
                                <td>20</td>
                                <td>1</td>
                            </tr>

                        </tbody>
                    </table>

                </div>
            </div>
            <div class="send-goods-box">
                <div class="col-sm-12 box-title">发货</div>

                <div class="col-sm-12 wl">
                    送货方式：
                    <select name="" id="">
                        <option value="">快递</option>
                        <option value="">物流</option>
                    </select>
                </div>
                <div class="col-sm-12 wl-company"  >
                    快递公司：
                    <select name="">
                        <option value="">申通</option>
                        <option value="">韵达</option>
                        <option value="">百世汇通</option>
                    </select>
                    <input type="text" placeholder="快递单号">
                </div>
                <div class="col-sm-12">
                    <button class="btn btn-primary sendBtn">发货</button>
                </div>


            </div>
        </div>










        <!-- 全局js -->
        <script src="../js/jquery.min.js?v=2.1.4"></script>
        <script src="../js/bootstrap.min.js?v=3.3.6"></script>

        <script src="../js/plugins/jeditable/jquery.jeditable.js"></script>

        <!-- Data Tables -->
        <script src="../js/plugins/dataTables/jquery.dataTables.js"></script>
        <script src="../js/plugins/dataTables/dataTables.bootstrap.js"></script>


        <!-- Peity -->
        <script src="../js/plugins/peity/jquery.peity.min.js"></script>
        <!-- iCheck -->
        <script src="../js/plugins/iCheck/icheck.min.js"></script>

        <!-- Peity -->
        <script src="../js/demo/peity-demo.js"></script>

        <!--paging-->
        <script src="../js/my-js/paging.js"></script>
        <!-- 自定义js -->
        <script src="../js/content.js?v=1.0.0"></script>
        <script src="../js/my-js/global.js"></script>
        <script src="../js/my-js/new-order.js"></script>

        <script>
            $(document).ready(function(){
                var searchObj = getSearch();
                var id = searchObj.id;
                var orderInfo;
                getAjaxAsync(global.apiUrl+'/admin_get_shop_content',function(res){
                    console.log(res);
                    orderInfo = res[0]
                },{id:id})
                var userInfo = `
                    <li>收货人：${orderInfo.name}</li>
                    <li>联系电话：${orderInfo.phone}</li>
                    <li>地址：${orderInfo.sheng+orderInfo.shi+orderInfo.qu+orderInfo.address}</li>
                `;
                $('#user-info').html(userInfo);
                $('#order-num').text('订单编号：'+orderInfo.order_num);
                var payDateTime = timeStampToTime(orderInfo.paytime);
                $('#order-time').text('下单时间：'+payDateTime);
                var status = orderStatus(orderInfo.status);
                $("#order-status").text(status);
                var goods = orderInfo.content;
                var goodsInfo =`
                             <tr>
                                <td class="goods-info">
                                    <div class="goods-img" style="background:url(${goods[0].top_img}) no-repeat center center /cover"></div>
                                    <div class="goods-details">
                                        <p class="goods-name">${goods[0].content_name}</p>
                                        <p class="gg">商品规格：${goods[0].gg}</p>
                                    </div>
                                </td>
                                <td>${goods[0].price}</td>
                                <td>${goods[0].num}</td>
                                <td rowspan="${goods.length}">${orderInfo.order_jf}</td>
                                <td rowspan="2">${orderStatus(orderInfo.status)}</td>
                            </tr>
                `;
                for(var i=1;i<goods.length;i++){
                    goodsInfo += `
                        <tr>
                            <td class="goods-info">
                                <div class="goods-img" style="background:url(${goods[i].top_img}) no-repeat center center /cover"></div>
                                <div class="goods-details">
                                    <p class="goods-name">${goods[i].content_name}</p>
                                    <p class="gg">商品规格：${goods[i].gg}</p>
                                </div>
                            </td>
                            <td>${goods[i].price}</td>
                            <td>${goods[i].num}</td>
                        </tr>
                    `
                }
                $('#goods-info').html(goodsInfo);

            })

        </script>




    </body>

</html>

